<template>
	<div id="headerMenu">
		<div>
			<div class="main">
				<div class="main-left">
					<div class="sign">
						<div></div>
						<div @click="login" class="Dolov"><span>Dolov</span></div>
					</div>
	
					<!--PC端菜单-->
	
					<div class="menu" v-if="$mq.resize && $mq.above('960px')">
						<ul>
							<li v-for="(item,i) in menuList" @click="to(item.path,i)" :class="{'active':index==i}">{{item.name}}</li>
						</ul>
					</div>
	
					<!--移动端菜单-->
	
					<div class="m-menu" v-if="!($mq.resize && $mq.above('960px'))">
						<div>
							<div>
								<div @click="menuOff" class="m-menu-sign"><span class="iconfont">&#xe650;</span></div>
								<ul v-show="menuShow" class="m-menu-ul">
									<li v-for="(item,i) in menuList" @click="to(item.path,i)" :class="{'active':index==i}">{{item.name}}</li>									
								</ul>
							</div>
						</div>
					</div>
	
				</div>
				<div class="login">
					<span></span>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	import main from './main';
	export default {
		...main
	}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss">
	@import '../../style/mixin.scss';
	@import "./style.scss";
</style>